<div class="flex-row top-bar">
    <div class="menu-brand menu-brand-small flex-col" *ngIf="showLogo">
        <h6>SF</h6>
        <span>by hackerschoice</span>
    </div>
    <div class="controls-view flex-row">
        <terminal-controls [activeTerminalId]="activeTerminalId" (activeTerminalIdChange)="setActiveTerminal($event)"
            [(terminalWindows)]="terminalWindows" (noOfTerminalsChange)="setNoOfTerminals($event)">
        </terminal-controls>
        <app-controls></app-controls>
    </div>
</div>

<div  *ngIf="terminalWindows.length>0" class="terminals-container">
    <app-terminal *ngFor="let term of terminalWindows" class="terminal"
        [ngClass]="{'hidden' : activeTerminalId !== term.id}" [TermId]="term.id">
    </app-terminal>
</div>

<div *ngIf="terminalWindows.length==0" class="terminals-container">
    <div  class="page-info-text">
        No Open Terminals,<br> Press [+] on the top left corner to open a new one.
    </div>
</div>